<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="../../mobileHeader_inc.jsp" %>
<title>失物招领</title>
<script type="text/javascript">
	var pageArray = [];
	var allCount;//获取总记录条数
	var allPage;//计算出总共页数
	var currentPage = 1;//设置当前页
	var rows = 5;//设置每页列数
	$(document).on('pageinit', function () {
		loadMsg(1);
    
	});
	function loadMsg(page){
		currentPage = page;
		var create_Time;
		var msgId;
		$.ajax({
	        url: '${ctx}/mobile/getLostAndFound?page='+page+'&rows='+rows+'',
	        dataType: "json",
	        async: true,
	        success: function (result) {
	        	//分页相关
	        	allCount =  result.rows;
	        	allPage  = Math.ceil(allCount/rows);//总页数
	        	var upPage;//上一页
	        	if(currentPage-1 <= 0){
	        		upPage = 1;
	        	}else{
	        		upPage = currentPage-1;
	        	}
	        	var downPage;//下一页
	        	if(currentPage+1 > allPage){
	        		downPage = allPage;
	        	}else{
	        		downPage = currentPage+1;
	        	}
	        	$("#top_count_num").empty();
	        	$("#count_num").empty();
	        	//var td_need = "  <ul data-am-widget='pagination' class='am-pagination am-pagination-default' >"+
	        	//" <li class='am-pagination-first'> <a href='#' onclick='loadMsg(1);' target='_self' class=''> 第一页</a> </li>"+		
	        	//" <li class='am-pagination-prev'> <a href='#' onclick='loadMsg("+upPage+");' target='_self' class=''>上一页</a> </li>"+
	        	//"<li class='am-pagination-next'> <a href='#' target='_self' onclick='loadMsg("+downPage+");' class=''>下一页</a> </li>"+
	        	//"<li class='am-pagination-last'> <a href='#'  target='_self' onclick='loadMsg("+allPage+");' class=''>最末页</a> </li>  </ul>";
	        	//$("#top_count_num").append(td_need);
	        	//$("#count_num").append(td_need);
	        	var down_need_num = "  <ul data-am-widget='pagination' class='am-pagination am-pagination-default' > </ul>";
	        	$("#count_num").append(down_need_num);
	        	for(var i=1;i<=allPage;i++){
	        		pageArray[i] = i;
	        		ulNum = "<li class=''><a href='#' class='am-active' onclick='loadMsg("+pageArray[i]+");' target='_self' >"+pageArray[i]+"</a></li>";
	    			$("#count_num ul").append(ulNum);
	    		}
	        	$("#product").empty();
	        	if(result.obj != null){
	        		var content = new Array();
	        		for(var i=0;i<result.obj.length;i++){
	        			create_Time = formatDate(result.obj[i].releaseTime);
	        			msgId = result.obj[i].arcitleId;
	        			content[i] = "<li class='am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left'> <div class='am-u-sm-4 am-list-thumb'> <a href='/mobile/goLAFDetail?id="+msgId+"' target='_self' class=''> <img height='100px' src='"+result.obj[i].lafIcon+"'  alt='失物招领图缩略图'/></a></div> <div class=' am-u-sm-8 am-list-main'><h3 class='am-list-item-hd'><a href='/mobile/goLAFDetail?id="+msgId+"' target='_self' class=''> "+result.obj[i].arcitleName+"</a></h3><div class='am-list-item-text'>"+result.obj[i].iteminform+"</div><div class='am-list-item-text'>"+create_Time+"</div></div></li> ";	        	
		        	}
	        		$("#product").empty();
	        		$("#product").append("<div class='am-list-news-bd'><ul class='am-list'>"+content.join(" ")+"</ul></div>");
	        	}
	        },
	        error: function (request, error) {
	        	$("#doc-scrollspy-wrapper").append("<div class='am-alert'> 暂时没有帮助信息哦 ！ </div>");
	        }
	        
	    });
	}
	//格式化日期
	function formatDate (strTime) {
	    var date = new Date(strTime);
	    return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds();
	}
</script>
</head>
<body>
<div>
  <header data-am-widget="header"
          class="am-header am-header-default joan-head">
      <div class="am-header-left am-header-nav">
          <a href="/mobile/goschoolLive" target="_self" class="">
                返回
          </a>
      </div>

      <h2 class="am-header-title">
          失物招领
      </h2>

      <div class="am-header-right am-header-nav">
          <a href="/mobile/goSendLAF" target="_self" class="">
 			发布
          </a>
      </div>
  </header>
  
  <div class="list-content">
		<div id="product" data-am-widget="list_news" class="am-list-news am-list-news-default">
		</div>  
		<!-- 分页 -->
		<div id="count_num">
		</div>
 <ul data-am-widget="pagination" class="am-pagination am-pagination-default">  
  <div data-am-widget="gotop" class="am-gotop am-gotop-default" >
    <a href="#top" title="回到顶部">
        <span class="am-gotop-title">回到顶部</span>
          <i class="am-gotop-icon am-icon-chevron-up"></i>
    </a>
  </div>
   </ul>
   </div>
   <footer data-am-widget="footer"
          class="am-footer am-footer-default"
           data-am-footer="{  }">
    <div class="am-footer-switch">
    <span class="am-footer-ysp" data-rel="mobile"
          data-am-modal="{target: '#am-switch-mode'}">
          云适配版
    </span>
      <span class="am-footer-divider"> | </span>
      <a id="godesktop" data-rel="desktop" class="am-footer-desktop" href="javascript:">
          电脑版
      </a>
    </div>
    <div class="am-footer-miscs ">

          <p>由 <a href="http://www.yunshipei.com/" title="诺亚方舟"
                                                target="_blank" class="">诺亚方舟</a>
            提供技术支持</p>
        <p>CopyRight©2014  AllMobilize Inc.</p>
        <p>京ICP备13033158</p>
    </div>
  </footer>

  <div id="am-footer-modal"
       class="am-modal am-modal-no-btn am-switch-mode-m am-switch-mode-m-default">
    <div class="am-modal-dialog">
      <div class="am-modal-hd am-modal-footer-hd">
        <a href="javascript:void(0)" data-dismiss="modal" class="am-close am-close-spin " data-am-modal-close>&times;</a>
      </div>
      <div class="am-modal-bd">
          您正在浏览的是

        <span class="am-switch-mode-owner">
            云适配
        </span>

        <span class="am-switch-mode-slogan">
              为您当前手机订制的移动网站。
        </span>
      </div>
    </div>
  </div>
  
  
  
  
  
  
</div>

</body>
</html>